<template>
	<view class="content">
		<view class="main" @click="linkToDetail">
			<view class="data">
				<view class="header">
					<view class="icon">
						{{ provinceComputed }}
					</view>
					<view class="projectName">
						{{ props.projectData.enterpriseName }}
					</view>
					<view class="projectStatus">
						<dict-tag :options="props.enterpriseList" :dictValue="props.projectData?.type"></dict-tag>
					</view>
				</view>
				<view class="body">
					<view class="item">{{ props.projectData.contactName }}&nbsp;|&nbsp;{{ props.projectData?.contactTitle }}&nbsp;|&nbsp;{{ props.projectData.contactInformation }}</view>
				</view>
			</view>
			<view class="subData">
				<view class="name">
					{{ props.projectData.processProject }}/{{ props.projectData.totalProject }}个项目进行中
				</view>
				<view class="time">
					最近更新: {{props.projectData.updateByName}}&nbsp;{{ createTimeComputed }}
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { defineProps, computed, withDefaults } from "vue"
	import type { UserItem, UserData } from "@/pages/userList/types"
	import dictTag from "@/components/dictTag/index.vue";
	const props = withDefaults(defineProps<UserItem>(), {
		projectData: () : UserData => ({
			createTime: "",
			projectName: "",
			deptName: "",
			enterprise: {
				enterpriseName: "",
				enterpriseId: "",
				cooperation: "",
			},
			intentionLevel: "",
		}),
		contactTitleList: () => [],
		enterpriseList: () => [],
	})
	
	//地址
	let provinceComputed = computed(() => {
		let { province } = props.projectData
		if(!province) return "--"
		let target = province.split("/")
		if(target && target.length){
			return target[1]
		}else{
			return '--'
		}
	})
	
	//更新时间
	let createTimeComputed = computed(() => {
		let { createTime } = props.projectData
		if(createTime){
			let target = createTime.split(" ")
			return target[0]
		}else{
			return "--"
		}
	})

	//前往详情页
	let linkToDetail = () : void => {
		let { enterpriseId } = props.projectData
		uni.navigateTo({
			url: `/pages/userItemDetail/userItemDetail?enterpriseId=${enterpriseId}`
		})
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		margin-bottom: 30rpx;
padding: 20rpx;
			box-sizing: border-box;
		.main {
			width: 100%;
			border-radius: 20rpx;
			overflow: hidden;
			box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.1);

			.data {
				width: 100%;
				background: #fff;
				padding: 20rpx 20rpx 30rpx 20rpx;
				box-sizing: border-box;

				.header {
					width: 100%;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 40rpx;

					.icon {
						width: 90rpx;
						max-width: 200rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						flex: 0 0 auto;
						white-space: nowrap;
						margin-right: 10rpx;
						background: #383e9e;
						color: #fff;
						text-align: center;
						padding: 10rpx;
						border-radius: 8rpx;
						font-size: 26rpx;
					}

					.projectName {
						flex: 1 1 auto;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						min-width: 0;
						font-weight: bold;
					}

					.projectStatus {
						flex: 0 0 auto;
						white-space: nowrap;
						font-weight: bold;
						color: #403fa1;
					}
				}

				.body {
					padding-left: 120rpx;
					box-sizing: border-box;
					color: #666666;
					font-size: 28rpx;
					font-weight: 600;

					.item {
						height: 70rpx;
						line-height: 70rpx;
					}
				}
			}

			.subData {
				background: #fff;
				border-radius: 10rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				border-top: 1px solid #efefef;
				padding: 20rpx 10rpx 20rpx 120rpx;
				box-sizing: border-box;
				background-color: #f9f9fb;
				font-weight: 600;
				.name {
					flex: 1;
					font-size: 28rpx;
					color: #666666;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}

				.time {
					color: #b3b3b4;
					font-size: 32rpx;
					width: fit-content;
					white-space: nowrap;
					font-size: 24rpx;
				}
			}
		}
	}
</style>